<style>
    .rich-table-cell{
        font-size:15px;
    }
</style>
<f:view>
    <a4j:region>
    <h:form>
        <h:panelGrid columns="3" >
            <h:outputText value="Resume Postings of #{sessionBean.ejbSession.currentSite.site}" style="font-size: 20px; font-weight: bold;"/>
            <c:if test="${!empty sessionBean.areasCurrentSite}" >
            <h:outputText value=", " style="font-size: 20px; font-weight: bold;"/>
            <h:selectOneMenu id="area" value="#{adminBean.areaId}" >
                    <f:selectItem
                        itemValue="0"
                        itemLabel="All Areas"/>
                <c:forEach var="area" items="#{sessionBean.areasCurrentSite}" >
                    <f:selectItem
                        itemValue="#{area.id}"
                        itemLabel="#{area.area}"/>
                </c:forEach>
                <a4j:support event="onchange" action="#{adminBean.changeCurrentArea}" reRender="resumePostingsForm"/>
            </h:selectOneMenu>
            </c:if>
        </h:panelGrid>
    </h:form>    
    <div align="center">
    <h:form>
        <h:messages globalOnly="true" style="color: red" styleClass="errorMessage"/>
        <h:panelGrid columns="4" >
            <h:outputText value="Search for:"/>
            <h:inputText id="searchValue" maxlength="50" value="#{resumeBean.searchValue}" />
            <a4j:commandButton id="submit" type="submit" value="Search" reRender="resumePostingsForm" />
            <h:panelGroup>
                <h:selectBooleanCheckbox value="#{resumeBean.onlySearchTitles}" /><h:outputText value="only search titles"/>
                <h:selectBooleanCheckbox value="#{resumeBean.hasImage}" /><h:outputText value="has image"/>
            </h:panelGroup>
        </h:panelGrid>
        <rich:spacer height="10" />    
    </h:form>
    <a4j:status startText="Searching..." stopText="Complete" />
    </a4j:region>
    <h:form id="resumePostingsForm">
        <rich:dataTable id="resumePostingsTable" rows="5" value="#{resumeBean.listResumes}" var="resume" border="1" >
            
            <rich:column>
                <f:facet name="header">
                    <h:outputText value="Publish Date" />
                </f:facet>
                <h:outputText value="#{resume.publishDate}">
                    <f:convertDateTime type="date" dateStyle="medium"/>
                </h:outputText>
            </rich:column>
            
            <rich:column>
                <f:facet name="header">
                    <h:outputText value="Title" />
                </f:facet>
                <h:outputLink value="/site/faces/posting.html?site=#{sessionBean.ejbSession.currentSite.id}&type=resume&id=#{resume.id}" >
                    <h:outputText value="#{resume.title}"/>
                </h:outputLink>
                <h:outputText value=" - (#{resume.location})" rendered="#{resume.location!=null && resume.location!=''}" />
            </rich:column>
            
        </rich:dataTable>
        <rich:spacer height="10" />
        <rich:datascroller for="resumePostingsTable" page="#{resumeBean.page}" maxPages="5" />
    </h:form>
    </div>
    <h:form>
        <h:commandLink value="Back to Welcome Page" action="#{resumeBean.backEdit}" />
    </h:form>
    <rich:separator height="1" />
</f:view>